<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org" >
<head th:replace="main/_fragments :: header(~{::title},~{::link},~{::meta})">
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width,initial-scale=1.0">
    <title>博客分类新增页面</title>
    <!--引入markdown css-->
    <link rel="stylesheet" href="../../static/markdown/css/editormd.css" th:href="@{/static/markdown/css/editormd.css}"/>
</head>
<body>

<!--头部导航-->
<div th:replace="main/_backEnd :: header_backEnd(2)"></div>

<!--二级导航-->
<div class="ui attached pointing menu">
    <div class="ui container">
        <a th:href="@{/admin/category}" target="_blank" class="active teal item">发布</a>
        <a th:href="@{/admin/categorys}" target="_blank" class="item">列表</a>
    </div>
</div>

<!--中间内容   ctrl+enter先输入内容然后注释-->
<!--div +tab 快速补全代码-->
<div  id="middle-content"  class="m-container-small m-padded-tb-big">
    <div class="container">


        <br>
        <br>
        <h1 th:if="${typeBean.id != null}">修改分类</h1>
        <h1 th:unless="${typeBean.id != null}">新增分类</h1>
        <br>
        <br>
        <br>
        <br>
        <form action="#" method="post" class="ui form" th:action="@{/admin/category}" th:object="${typeBean}">
            <!-- 修改为put方式  -->
            <input type="hidden" value="put" name="_method" th:if="${typeBean.id != null}">

            <!--  隐藏主键id  -->
            <input type="hidden" th:value="*{id}" name="id">

            <div class="field">
                <div class="ui left labeled action input">
                    <label class="ui compact teal basic label">分类名称</label>
                    <input type="text" placeholder="分类名称" name="name" th:value="*{name}">
                </div>
            </div>
            <!--显示错误内容-->
            <div class="field"><div class="ui error message"></div></div>

            <!-- 显示后台验证失败错误信息-->
            <!--/*/
                <div class="ui negative message" th:if="${#fields.hasErrors('name')}">
                    <i class="close icon"></i>
                    <div class="header"th:text="${typeBean.id != null ?'更新失败':'新增失败'}"></div>
                    <p th:errors="*{name}"></p>
                </div>
            /*/-->

            <div class="ui right aligned container">
                <button class="ui button" type="button" onclick="window.history.go(-1)">返回</button>
                <button class="ui teal button" type="submit">提交</button>
            </div>
        </form>
        <br>
        <br>
        <br>
    </div>
</div>

<div th:replace="main/_fragments :: toTop"></div>
<!--尾部-->
<footer th:replace="main/_fragments :: footer"></footer>


<!--引入js-->
<th:block th:replace="main/_fragments :: script"></th:block>

<script>

    $('.ui.dropdown').dropdown();

    // 表单验证
    $('.ui.form')
        .form({
            fields: {
                name: {
                    identifier: 'name',
                    rules: [
                        {
                            type   : 'empty',
                            prompt : '分类名称不能为空'
                        }
                    ]
                }
            }
        });

    //消息提示框关闭
    $('.message .close').on("click",function () {
        $(this).closest('.message').transition('fade');
    });
</script>
</body>
</html>